Skip to main content
Version: 1.0.0

Waterfall Chart

Illustrates the cumulative effect of positive and negative contributions to a final result. This is particularly useful for understanding the drivers of change in financial performance, such as revenue, profit, or cash flow. It helps to visualize the cumulative impact of various factors, such as gains, losses, and adjustments, on the final outcome.

Chart:


Code:

const { muze, getDataFromSearchQuery } = viz;

const data = getDataFromSearchQuery();

const ColumnField = "month";
const RowFields = ["lowerValue", "upperValue"];
const ColorField = "type";

muze
  .canvas()
  .columns([ColumnField])
  .rows([muze.Operators.share(...RowFields)])
  .layers([
    {
      mark: "bar",
      encoding: {
        y: RowFields[1], 
        y0: RowFields[0], 
        color: ColorField,
      },
    },
  ])
  .config({
    axes: {
      x: {
        domain: data.getField(ColumnField).uniques(),
        name: "Month",
      },
      y: {
        name: "Sales",
      },
    },
  })
  .data(data)
  .mount("#chart"); // mount your chart